<template>
  <div>
    <!--历史-->
    <template v-if="modalType === 2">
      <a-table :columns="columns"
               :pagination="false"
               :scroll="{y:'220px'}"
               :rowKey="(data, index) => index" bordered
               :data-source="tableList" >
      </a-table>
      <div class="table-view-page">
        <span>总数:{{query.total}}条</span>
        <a-pagination v-model="query.pageNo" :total="query.total" @change="pageChange" show-less-items />
      </div>
    </template>
    <!--详情-->
    <template v-else>
      <div class="form-row">
        <div>经营单位名称：</div>
        <div>{{modalObj.jddwmc}}</div>
      </div>
      <div class="form-row">
        <div>详细地址：</div>
        <div>{{modalObj.door}}</div>
      </div>
      <div class="form-row">
        <div>市-县区名称：</div>
        <div>{{modalObj.cityName + '-' + modalObj.countyName}}</div>
      </div>
      <div class="form-row">
        <div>统一社会信用代码：</div>
        <div>{{modalObj.tyshxydm}}</div>
      </div>
      <div class="form-row">
        <div>完工日期：</div>
        <div>{{modalObj.bgsj}}</div>
      </div>
      <div class="form-row">
        <div>经度：</div>
        <div>{{modalObj.lng}}</div>
      </div>
      <div class="form-row">
        <div>纬度：</div>
        <div>{{modalObj.lat}}</div>
      </div>
      <div class="form-row">
        <div>清洗状态：</div>
        <div>
          <a-tag :color="getTextAndColor().color">{{getTextAndColor().text}}</a-tag>
        </div>
      </div>
    </template>
  </div>
</template>

<script>
export default {
  name: "disinfectInfo",
  props:{
    //操作类型，1详情，2历史
    modalType:{
      type:Number,
      default:0
    },
    //操作对象
    modalObj:{
      type:Object,
      default:()=>{
        return {}
      }
    },
    //弹框类型，1清洗，2空调
    type:{
      type:Number,
      default:1
    }
  },
  data(){
    return{
      columns:[
        {
          title:'检查单位',
          dataIndex: 'jcdw',
          align:'center',
          ellipsis:true,
        },
        {
          title:'被检查单位',
          dataIndex: 'bjcdwmc',
          align:'center',
          ellipsis:true,

        },
        {
          title:'项目完工日期',
          dataIndex: 'bgsj',
          align:'center',
          width:220,
        },
        {
          title:'市',
          dataIndex: 'cityName',
          align:'center',
          width:160,
        },
        {
          title:'区/县',
          dataIndex: 'countyName',
          align:'center',
          width:160,
        },
      ],
      tagsList:[],
      query:{
        tyshxydm:'',
        pageNo:1,
        pageSize:10,
        total:0,
      },
      tableList:[],
    }
  },
  mounted() {
    //清洗
    if(this.type===1){
      this.tagsList = ['未清洗','已过期','即将过期','已清洗']
    }
    else {
      this.tagsList = ['未检测','已过期','即将过期','已检测']
    }
    this.query.tyshxydm = this.modalObj.tyshxydm;
    this.getHistory()
  },
  methods:{
    getHistory(){
      let { pageNo,...query } = this.query;
      let path =this.type===1?'qxxdHistoryList':'jzktjcHistoryList'
      this.$axios.get('report/testReportInfo/map/'+path,{
        params:{
          pageNo:pageNo-1,
          ...query,
        },
      }).then(res=>{
        let result = res.data.result;
        this.tableList = result.list;
        this.query.total = result.size
        this.tableLoad = false;
      })
    },
    getTextAndColor(){
      let val = this.type===1?this.modalObj.qxzt:this.modalObj.jczt;
      return {
        color:['#2db7f5','#f50','yellow','#87d068'][val*1],
        text:this.tagsList[val*1],
      }
    },
    pageChange(page){
      this.query.pageNo = page
      this.getHistory()
    }
  }
}
</script>

<style lang="scss" scoped>
.table-view-page{
  display: flex;
  justify-content: flex-end;
  margin-top: 20px;
  >span{
    display: flex;
    align-items: center;
    padding: 0 10px;
  }
}
.form-row{
  display: flex;
  margin-bottom: 10px;
  padding: 8px;
  >div:first-child{
    width: 160px;
    text-align: right;
    font-weight: bolder;
  }
  >div:last-child{
    flex: 1;
    padding-left: 10px;
  }
}
</style>